<template>
  <section class="oa-form__table">
    <h5>{{ approve.name }}</h5>
    <table cellpadding="0" cellspacing="0">
      <tr v-if="$route.query.from != 'new'">
        <td>事务编号</td>
        <td>
          {{ approve.name }}
          <span v-if="approve && approve.code">{{ approve.code }}</span>
        </td>
      </tr>
      <tr>
        <td>流程名称</td>
        <td>
          <span v-if="$route.query.from == 'new'">新建{{ approve.name }}</span>
          <span v-else>
            {{ approve.approve_name }}
          </span>
        </td>
      </tr>
      <tr>
        <td>申请事由</td>
        <td :title="reason"><el-input placeholder="申请事由" type="textarea" v-model="reason" :disabled="$route.query.from != 'new'"/></td>
      </tr>
    </table>
    <h3 class="oa-form__table-title">
      <span v-if="$route.query.from === 'new'">{{ approve.name }}</span>
      <span v-else>
        {{ approve.approve_name }}
      </span>
    </h3>
   <table class="achievement__tab" border="1">
      <tr>
        <td>考核周期:</td>
        <td>
          <el-date-picker
            value-format="yyyy-MM-dd"
            type="date"
            v-model="applyTime"
            :disabled="$route.query.from !== 'new'"
            placeholder="考核周期">
          </el-date-picker>
        </td>
        <td>部门:</td>
        <td width="400">
          <el-select v-model="department" :disabled="$route.query.from != 'new'" placeholder="请选择">
            <el-option
              v-for="item in departments"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </td>
        <td>姓名:</td>
        <td>
          <el-select v-model="value" style="width:60%" :disabled="$route.query.from != 'new'" placeholder="请选择"  @change="selectStaff($event)">
            <el-option
              v-for="item in staff"
              :key="item.value"
              :label="item.label"
              :value="item">
            </el-option>
          </el-select>
        </td>
        <td>岗位:</td>
        <td><el-input v-model="obj.a1017" :disabled="obj.a1017Flag" /></td>
        <td></td>
      </tr>
      <tr>
        <td rowspan="2">序号</td>
        <td>上级组织目标：<el-input type="textarea" :rows="3" v-model="obj.a1021" :disabled="obj.a1021Flag" /></td>
        <td rowspan="2">目标评级</td>
        <td rowspan="2">关键结果（KR）</td>
        <td rowspan="2">O分值</td>
        <td rowspan="2">KR完成情况</td>
        <td rowspan="2">完成率</td>
        <td rowspan="2">O得分</td>
        <td rowspan="2">月底评级:</td>
      </tr>
      <tr>
        <td>目标（O）</td>
      </tr>
      <tr>
      <td rowspan="5">1</td>
      <td rowspan="5"><el-input type="textarea" :rows="3"  v-model="obj.a1022" :disabled="obj.a1022Flag" /></td>
      <td rowspan="2">自我评级：<el-input v-model="obj.a1043" :disabled="obj.a1043Flag" /></td>
      <td>KR1:<el-input v-model="obj.a1023"  type="textarea" :rows="3" :disabled="obj.a1023Flag" /></td>
      <td rowspan="5">100%</td>
      <td><el-input v-model="obj.a1029" type="textarea" :rows="3" :disabled="obj.a1029Flag" /></td>
      <td><el-input v-model="obj.a1034" :disabled="obj.a1034Flag" /></td>
      <td rowspan="5"><el-input v-model="obj.a1039" :disabled="obj.a1039Flag" /></td>
      <td rowspan="5">
        <el-input v-model="obj.a1040" :disabled="obj.a1040Flag" />
      </td>
    </tr>
    <tr>
      <td>KR2:<el-input v-model="obj.a1024" type="textarea" :rows="3" :disabled="obj.a1024Flag" /></td>
      <td><el-input v-model="obj.a1030" type="textarea" :rows="3" :disabled="obj.a1030Flag" /></td>
      <td><el-input v-model="obj.a1035" :disabled="obj.a1035Flag" /></td>
    </tr>
    <tr>
      <td rowspan="3">领导评级：<el-input v-model="obj.a1028" type="textarea" :rows="3"  :disabled="obj.a1028Flag" /></td>
      <td>KR3:<el-input v-model="obj.a1025" type="textarea" :rows="3"  :disabled="obj.a1025Flag" /></td>
      <td><el-input v-model="obj.a1031" type="textarea" :rows="3" :disabled="obj.a1031Flag" /></td>
      <td><el-input v-model="obj.a1036" :disabled="obj.a1036Flag" /></td>
    </tr>
    <tr>
      <td>KR4:<el-input v-model="obj.a1026" type="textarea" :rows="3"  :disabled="obj.a1026Flag" /></td>
      <td><el-input v-model="obj.a1032" type="textarea" :rows="3" :disabled="obj.a1032Flag" /></td>
      <td><el-input v-model="obj.a1037" :disabled="obj.a1037Flag" /></td>
    </tr>
    <tr>
      <td>KR5:<el-input v-model="obj.a1027" type="textarea" :rows="3" :disabled="obj.a1027Flag" /></td>
      <td><el-input v-model="obj.a1033" type="textarea" :rows="3" :disabled="obj.a1033Flag" /></td>
      <td><el-input v-model="obj.a1038" :disabled="obj.a1038Flag" /></td>
    </tr>
    </table>
    <table class="achievement__tab" border="1">
      <tr>
        <td colspan="3">OKR结果等级对应月薪奖金系数</td>
      </tr>
      <tr>
        <td>等级</td>
        <td>描述</td>
        <td>奖金</td>
      </tr>
      <tr>
        <td>S+</td>
        <td>重大贡献，重要表率</td>
        <td>不设上限</td>
      </tr>
      <tr>
        <td>S</td>
        <td>高难度目标出色完成，重大创新改善</td>
        <td>100%</td>
      </tr>
      <tr>
        <td>S-</td>
        <td>完成很难目标，付出巨大努力</td>
        <td>40%-50%</td>
      </tr>
      <tr>
        <td>A+</td>
        <td>出色创新改善</td>
        <td>30%-40%</td>
      </tr>
      <tr>
        <td>A</td>
        <td>完成较难目标，有较好创新改善</td>
        <td>20%-30%</td>
      </tr>
      <tr>
        <td>A-</td>
        <td>有一定创新改善</td>
        <td>10%-20%</td>
      </tr>
      <tr>
        <td>B+</td>
        <td>完成一定目标，工作表现认真负责</td>
        <td>5%-10%</td>
      </tr>
      <tr>
        <td>B</td>
        <td>工作表现良好</td>
        <td>0</td>
      </tr>
      <tr>
        <td>B-</td>
        <td>工作表现有一定马虎</td>
        <td>0</td>
      </tr>
      <tr>
        <td>C</td>
        <td>工作表现较差</td>
        <td>0，连续2次劝退</td>
      </tr>
      <tr>
        <td>D</td>
        <td>有重大过失</td>
        <td>劝退</td>
      </tr>
    </table>
    <history :process="process"></history>
    <files></files>
  </section>
</template>
<script>
import mixin from '@/mixins/index.js'
import history from '../service/components/process'
import files from '../service/components/files'
const obj = {}
for (let i = 1016; i <= 1043; i++) {
  obj[`a${i}`] = ''
  obj[`a${i}Flag`] = true
}
export default {
  mixins: [mixin],
  data () {
    return {
      reason: '',
      truename: '',
      department: '',
      flag: false,
      value: '',
      obj: JSON.parse(JSON.stringify(obj)),
      applyTime: '',
      gangwei: ' ',
      file_paths: [],
      file_names: [],
      field_ids: [],
      field_vals: [],
      autoField: []
    }
  },
  components: { history, files },
  props: ['curDepartment', 'userInfo', 'approve', 'staff', 'addDofield', 'departments', 'process'],
  computed: {
    uploadArr () {
      return this.$store.state.uploadArr
    }
  },
  watch: {
    addDofield () {
      this.addDofieldRender()
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.obj = JSON.parse(JSON.stringify(obj))
      if (this.$route.query.from === 'new') {
        this.disabled = true
      } else {
        this.infoFunc()
      }
    })
  },
  methods: {
  }
}
</script>
